//初始化商品页渲染数据
localStorage.setItem('switch1', 'flower')
//检测本地存储是否开启
var te = localStorage.getItem('arr')
if(te==null){
	var arr=[]
	localStorage.setItem('arr',JSON.stringify(arr))
}
//获取操作对象
var minshow=document.querySelector(".minshow")
var mark=document.querySelector(".mark")
var showimg=document.querySelector(".show-img")
var rightImg=showimg.querySelector("img")
var tips=document.querySelector(".deta-r h3")
var price=document.querySelector(".deta-r h4")

//换图片路径以及换取数据
		//获取数据
		var url1 = localStorage.getItem('str1')//show-img插图
		var url2 = localStorage.getItem('str2')//minshow背景图
		var tips1 = localStorage.getItem('miao1')//商品标题
		var price1 = localStorage.getItem('miao2')//商品价格
		//定义数组
		
		
		//换图
		showimg.children[0].src=url1
		minshow.style.background=`url(${url2})`
		minshow.style.backgroundSize="cover"
		//换标题
		tips.innerHTML=tips1
		//换价格
		price.innerHTML=price1
		
//放大镜
	//给下边盒子绑定鼠标移入事件
	minshow.onmouseover=function(e){
		mark.style.display="block"
		showimg.style.display='block'
	}
	//给下边盒子绑定鼠标移动事件
	minshow.onmousemove=function(e){
		var e = e || window.event
		//获取遮藏层移动的距离
		var top1=e.pageY-minshow.offsetTop-parseInt(mark.offsetHeight/2)
		var left1=e.pageX-minshow.offsetLeft-parseInt(mark.offsetWidth/2)
		//设置边界条件
		var maxX=minshow.offsetWidth-mark.offsetWidth
		var maxY=minshow.offsetHeight-mark.offsetHeight

		//设置上边图片的移动距离
		var rightTop,rightLeft
		//水平方向
		if(left1<=0){
			mark.style.left=0+'px'
			rightLeft=0
		}else if(left1>=maxX){
			mark.style.left=maxX+'px'
			rightLeft=maxX
		}else{
			mark.style.left=left1+'px'
			rightLeft=left1
		}

		//垂直方向
		if(top1<=0){
			mark.style.top=0+'px'
			rightTop=0
		}else if(top1>=maxY){
			mark.style.top=maxY+'px'
			rightTop=maxY
		}else{
			mark.style.top=top1+'px'
			rightTop=top1
		}
		//让上边图片进行移动
		rightImg.style.top=-2*rightTop+'px'
		rightImg.style.left=-2*rightLeft+'px'
	}

	//给下边盒子绑定鼠标移出事件
	minshow.onmouseout=function(){
		mark.style.display="none"
		showimg.style.display='none'
	}
  
  
  //全局点击事件
  
  var uName = document.querySelector('.h-right li:nth-child(1)')//获取导航栏用户名对象
  var shoppcar = document.querySelector('.h-right li:nth-child(9)')//购物车商品数量
  var name = localStorage.getItem('user1')//获取用户名
  var rem1 = localStorage.getItem('rem')//获取用户记忆
  var num1 = localStorage.getItem('carnum')
  if(rem1=='1'){
  		uName.innerHTML=`<a href="login.html">您好,${name}! </a><a>&nbsp;退出</a>`
  	}
  shoppcar.children[3].innerHTML=localStorage.getItem('carnum')
  
  //通用，页面跳转
  document.onclick=function(e){
  	var e = e||window.event
  	var target = e.target || e.srcElement
  	//跳转商品列表页
  	if(target.innerHTML=="永生花"){
  		//用于渲染不同数据
  		localStorage.setItem('switch1','forever')
  		window.location.href="listPage.html"
  	}
  	if(target.innerHTML=="鲜花"){
  		//用于渲染不同数据
  		localStorage.setItem('switch1','flower')
  		window.location.href="listPage.html"
  	}
  	//跳转登录注册页
  	if(target.innerHTML=="注册||您好，请登录"){
  		window.location.href="login.html"
  	}
  	
  	//跳转首页
  	if(target.innerHTML=="首页"){
  		window.location.href="index.html"
  	}
  	//跳转购物车页
  	if(target.parentNode.className=="guowu"){
  		var check1=localStorage.getItem('rem')
  		if(check1==null){
  			alert('请先登录！查看购物车！')
			window.location.href="login.html"
  		}else{
  			 window.location.href="shopping.html"
  			}
  	}
  	//退出用户登录
  	if(target.innerHTML=="&nbsp;退出"){
  		if(confirm("退出后购物车将被清空，请问是否退出？")){
  			localStorage.removeItem('rem')
  			localStorage.removeItem('str1')
  			localStorage.removeItem('str2')
  			localStorage.removeItem('miao1')
  			localStorage.removeItem('miao2')
  			localStorage.setItem('carnum','0')
			var arr=[]
			localStorage.setItem('arr',JSON.stringify(arr))
  			window.location.href="index.html"
  		}
  	}
  	//加入购物车
  	if(target.innerHTML=="加入购物车"){
  		//检验是否登陆
  		var check1=localStorage.getItem('rem')
  		if(check1==null){
  			alert('请先登录！查看购物车！')
			window.location.href="login.html"
  		}else{
			//获取购物车渲染数据
			//获取上次存储数据
			var arr=JSON.parse(localStorage.getItem('arr'))
			//判断数组是否存在现在这个url1
			//循环每项的第一个元素
			var test=[]//测试数组(提取地址元素用于去重)
			for(var i=0; i<arr.length;i++){
				test.push(arr[i][0])
			}
			//如果有重复的，就不添加
			if(test.includes(url1)){
				alert("购物车中已经有这个宝贝了！")
			}else{
				//更换本页导航购物车物品数量值
				num1=arr.length+1
				localStorage.setItem('carnum',num1)
				shoppcar.children[3].innerHTML=localStorage.getItem('carnum')
				//添加新数据
				arr.push([url1,url2,tips1,price1])
				num1++
				localStorage.setItem('arr',JSON.stringify(arr))
				alert('已成功添加!')
			}
			
  			}
  		
  	}
  	
  }
